<template>
    <view class="container">
        <view class="list" v-for="(item, index) in datas.ProductSkuList" :key="index">
            <view class="top flex-between">
                <view class="top_left">
                    <view>{{ item.V_DisplayAttribute }}</view>
                    <view class="number">货号：{{ item.Sku }}</view>
                </view>
                <view>
                    <iconsfont
                        @click="del(item, index)"
                        v-if="datas.ProductSkuList.length > 1 && look == 0"
                        customIcons="icon-shanchu"
                        :color="'#999'"
                        size="40"></iconsfont>
                </view>
            </view>
            <view class="body">
                <view class="flex-start" v-for="subitem in item.ProductUnitPriceList">
                    <view class="title">售价（元/{{ subitem.UnitName }}）</view>
                    <view
                        ><input
                            type="number"
                            v-model="subitem.Price"
                            :disabled="look == 1"
                            placeholder="请输入商品售价"
                            placeholder-class="placeColor"
                    /></view>
                </view>
                <view class="flex-start">
                    <view class="title">成本价（元）</view>
                    <view
                        ><input
                            type="number"
                            v-model="item.CostPrice"
                            :disabled="look == 1 || enter == 1"
                            placeholder="请输入商品成本价"
                            placeholder-class="placeColor"
                    /></view>
                </view>
            </view>
        </view>
        <view class="footer" v-if="look == 0">
            <view class="btn btn-success-hollow" @click="submit">保存</view>
        </view>
    </view>
</template>

<script>
import { mapMutations } from "vuex"
import { InitProductData, SaveProduct } from "@/pages_supplier/service/api/product.js"
export default {
    components: {},
    data() {
        return {
            datas: {},
            id: "",
            look: 0,
            enter: 0,
        }
    },
    onLoad(e) {
        this.id = e.id
        this.look = e.look
        if (this.look == 1) {
            uni.setNavigationBarTitle({
                title: "价格",
            })
        }
        if (e.enter) {
            this.enter = e.enter
        }
    },
    mounted() {},
    onShow() {
        this.getinfo()
    },
    methods: {
        ...mapMutations(["UP_ADDPRODUCT_VIEW"]),
        getinfo() {
            let path = "?product_id=" + this.id
            InitProductData(path).then((res) => {
                if (res.State == 1) {
                    this.datas = res.Data.ProductModel
                } else {
                    this.easyToast(res.Msg)
                }
            })
        },
        del(item, index) {
            if (this.datas.ProductSkuList.length == 1) {
                this.easyToast("无法删除")
            } else {
                this.datas.ProductSkuList.splice(index, 1)
            }
        },
        selectFn(data) {
            const eventChannel = this.getOpenerEventChannel()
            eventChannel.emit("getSelectData", {
                ...data,
            })
            this.easyGoBack()
        },
        submit() {
            let verify = true
            this.datas.ProductSkuList.forEach((e, i) => {
                if (e.CostPrice === "" || e.CostPrice < 0) {
                    this.easyToast("请输入正确的成本价")
                    return (verify = false)
                }
                e.ProductUnitPriceList.forEach((sub, j) => {
                    if (sub.Price == "" || parseInt(sub.Price) <= 0) {
                        this.easyToast("请输入正确的售价")
                        return (verify = false)
                    }
                })
            })
            if (!verify) {
                return
            }
            let path = "?typeId=0&IsUpdateProductAttribute=0&CheckResult=0"
            SaveProduct(this.datas, path).then((res) => {
                if (res.State == 1) {
                    this.easyToast("保存成功")
                    this.UP_ADDPRODUCT_VIEW(new Date().getTime())
                    setTimeout((e) => {
                        this.easyGoBack()
                    }, 1000)
                } else {
                    this.easyToast(res.Msg)
                }
            })
        },
        //导航栏按钮事件
        onNavigationBarButtonTap(e) {
            if (this.look == 1) {
                return
            }
            let index = e.index
            if (index == 0) {
                //历史记录
                this.easyGoTo("/pages_supplier/packet/addProduct/batchset-price?id=" + this.id)
            }
        },
    },
}
</script>

<style lang="scss">
.container {
    padding: 24rpx 0 130rpx 0;
}
.list {
    padding: 24rpx;
    background: #ffffff;
    margin-bottom: 24rpx;
}
.top {
    font-size: 32rpx;
    color: #333;
    padding: 0 16rpx 16rpx 16rpx;
}
.number {
    font-size: 26rpx;
    color: #999;
}
.top_left {
    display: flex;
    flex-direction: column;

    view {
        padding: 7rpx 0;
    }
}
.body {
    background: #f4f5f6;
    padding: 0 24rpx;
    margin-bottom: 16rpx;
    & > view {
        font-size: 26rpx;
        height: 116rpx;
        color: #333333;
    }
    input {
        width: 292rpx;
        height: 68rpx;
        background: #ffffff;
        border-radius: 4rpx;
        font-size: 32rpx;
        text-indent: 20rpx;
        color: $app-color-main;
        font-weight: bold;
    }
    .title {
        width: 200rpx;
        padding-bottom: 16rpx;
    }
}
.placeColor {
    font-size: 28rpx;
    color: $color-gray-3;
    font-weight: normal;
}
.btn {
    margin: 16rpx 30rpx 0 30rpx;
}
</style>
